<ui:composition template="/WEB-INF/template/template.xhtml"
	xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">

	<ui:define name="header">
		<nav class="navbar navbar-default navbar-fixed-top">
			<div class="container">
				<div class="row">
					<a class="navbar-brand" href="#"
						style="padding-top: 5px; padding-right: 5px;"> <h:graphicImage
							library="img" name="c.png" width="40" height="40" />
					</a> <a class="navbar-brand" href="#" style="font-size: 27px">Complementary</a>

					<ul class="nav navbar-nav navbar-right">
						<li><a href="#" style="font-size: 20px;">Home</a></li>
					</ul>

				</div>
			</div>
		</nav>
	</ui:define>

	<ui:define name="main">

		<div class="panel panel-success">
			<div class="panel-body"
				style="background-color: #5cb85c; color: #fff;">
				<h3 class="panel-title">
						<h:outputText value="#{encontroBean.atividade.nome}" />
				</h3>
			</div>
			<div class="panel-footer">

				<h:form id="formCadastro" class="form-horizontal">
					<h:messages />
					<div class="form-group" style="margin-top: 10px;">
						<h:outputLabel value="Data:" for="data"
							class="col-sm-1 control-label"
							style="text-align: left; width: 80px;" />
						<div class="col-sm-1">
							<p:calendar locale="pt_BR" pattern="dd/MM/yyyy"
								requiredMessage="A data do encontro é obrigatória"
								required="true" value="#{encontroBean.encontro.data}" id="data"
								style="margin-top:5px;" />
						</div>
						<h:outputLabel value="Carga Horaria:" for="cargaHoraria"
							class="col-sm-1 control-label"
							style="text-align: left; width: 130px; margin-left: 150px" />
						<div class="col-sm-1">
							<h:inputText id="cargaHoraria" label="cargaHoraria"
								class="form-control" required="true"
								value="#{encontroBean.encontro.cargaHoraria}" />
						</div>
						<div class="col-sm-4">
							<h:commandButton value="Salvar" class="btn btn-success"
								action="#{encontroBean.addEncontro}"
								style="padding-right: 50px; padding-left: 50px; margin-left: 100px">
								<f:param name="idAtividade" value="#{flash.atividadeFlash}"></f:param>
							</h:commandButton>
						</div>
					</div>
				</h:form>
			</div>
		</div>

		<div class="panel panel-success">
			<div class="panel-body"
				style="background-color: #5cb85c; color: #fff;">
				<h3 class="panel-title">Data</h3>
			</div>
			<div class="panel-footer">
				<h:form id="formEncontros">
					<h:dataTable value="#{encontroBean.atividade.encontros}"
						var="encontro" class="table table-striped">
						<h:column>
							<h:commandLink action="#{participanteBean.listaDePresenca}">
								<h:outputText value="#{encontro.data}">
									<f:convertDateTime dateStyle="full" type="date" locale="pt_BR" />
								</h:outputText>
							</h:commandLink>
						</h:column>
					</h:dataTable>
				</h:form>
			</div>
		</div>


	</ui:define>

</ui:composition>